Please briefly explain about bundling and minification with a suitable example and with a figure.
Define Bundling and Minification in MVC.
3825
15-Feb-2020
Updated on 15-Feb-2020
Shrikant Mishra
14-Aug-2020Here bundling and minification are two techniques enabled by ASP.NET, an open-source tool for building services and web apps using. NET. ASP.NET Bundling is a simple feature that makes it easier to combine multiple files into one, while minification is a process whereby code in a script or CSS file is optimized.
Nishi Tiwari
17-Feb-2020The bundling and minification are the two separate techniques that are used to reduce the load time. This bundling reduces the number of requests to the Server, whereas minification reduces the size of the requested assets.
Mainly the browsers process six requests simultaneously to each Website that is why all additional requests are queued by the Browsers and if we reduce these requests, the queued time for the other requests will be decreased as well. Therefore, bundling is used to reduce these requests from the Browser to Server.
The minification is the process of removing all unnecessary characters from a text-based resource like JS and CSS in a way that doesn’t alter the expected functionality. It means shortening identifiers, aliasing functions and removing the comments, white-space characters, and newlines.
The bundling and minification technique in ASP.NET MVC offers by System.Web.Optimization class, which exists under the System.Web.Optimization dll.
Bundling
The bundling is a logical group of physical files, which loads on to a single HTTP request. If we have separate CSS files, then it can be loaded in a single request with the help of bundling. This bundling is also creating JavaScript files separately. A bundle can’t contain both the CSS and JavaScript files for this we need to create a separate bundle for CSS and JavaScript files and we have to create a bundle, based on the use of CSS or JS files in an application. For example, if an application uses both the bootstrap and site CSS for UI design, due to that we can create a common bundle for them, such as a core bundle. The given figure shows a logical grouping of a file to create a bundle.
Minification
The Minification can be describe as a technique for removing unnecessary characters like white space, newline, tab, comments and short variable names from the text-based files such as JavaScript and CSS files without expecting alter functionality to reduce the size, which causes to improve load times of a Webpage and also there are some tools which are available to minify JS and CSS files.